/*
 * @Author: Jimmy
 * @LastModifiedBy: Jimmy
 * @Date: 2024-12-14 18:27:51
 * @LastEditTime: 2025-02-16 10:28:08
 * @FilePath: /monitor_belt/src/views/setting/algorithm/index.tsx
 */
import { remoteAiInfo, updateAiInfo } from "@/api/system";
import { Button, Col, Flex, Form, Input, message, Row, Spin } from "antd";
import { useEffect, useState } from "react";

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 16 },
};

const Algorithm = () => {
  const [form] = Form.useForm();

  const [loading, setLoading] = useState<boolean>(false);

  useEffect(() => {
    searchInfo();
  }, []);

  const searchInfo = async () => {
    setLoading(true);
    try {
      let res = await remoteAiInfo();
      let { data } = res;
      form.setFieldsValue({ ...data });
    } finally {
      setLoading(false);
    }
  };

  const onFinish = () => {
    form
      .validateFields()
      .then(async (values) => {
        setLoading(true);
        try {
          console.log(values);
          let info = { ...values };
          await updateAiInfo(info);
          message.success("操作成功");
        } finally {
          setLoading(false);
        }
      })
      .catch((info) => {
        console.log("Validate Failed - ", info);
      });
  };

  const onReset = () => {
    form.resetFields();
  };
  return (
    <Flex flex={1} justify="center">
      <Form
        {...layout}
        form={form}
        name="basic"
        style={{ width: "1000px", marginTop: "20px" }}
        onFinish={onFinish}
      >
        <Row>
          <Col span={12}>
            <Form.Item
              label="Epsilon"
              name="epsilon"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入Epsilon" />
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item
              label="CornerThreshold"
              name="corner_threshold"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入CornerThreshold" />
            </Form.Item>
          </Col>
        </Row>
        <Row>
          <Col span={12}>
            <Form.Item
              label="Kernel"
              name="kernel"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入Kernel" />
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item
              label="Postion"
              name="position"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入Postion" />
            </Form.Item>
          </Col>
        </Row>
        <Row>
          <Col span={12}>
            <Form.Item label="Iter" name="iter" rules={[{ required: true }]}>
              <Input placeholder="请输入Iter" />
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item
              label="SaveLevel"
              name="save_level"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入SaveLevel" />
            </Form.Item>
          </Col>
        </Row>
        <Flex gap={30} justify="center">
          <Button htmlType="button" onClick={onReset}>
            重置
          </Button>
          <Button type="primary" htmlType="submit">
            保存
          </Button>
        </Flex>
      </Form>
      <Spin spinning={loading} fullscreen />
    </Flex>
  );
};

export default Algorithm;
